import Vue from "vue";
import VueRouter from "vue-router";

// 引入一级路由
// import Detail from "@/views/detail";
// import Login from "@/views/login";
// import Register from "@/views/register";
// import Layout from "@/views/layout";

// 引入二级路由
// import Article from "@/views/article";
// import Collect from "@/views/collect";
// import Like from "@/views/like";
// import User from "@/views/user";
// import NotFound from "@/views/notfound";

// ? 路由的懒加载(一级)
const Detail = () => import("@/views/detail");
const Login = () => import("@/views/login");
const Register = () => import("@/views/register");
const Layout = () => import("@/views/layout");

// 二级
const Article = () => import("@/views/article");
const Collect = () => import("@/views/collect");
const Like = () => import("@/views/like");
const User = () => import("@/views/user");
const NotFound = () => import("@/views/notfound");

Vue.use(VueRouter);

const routes = [
  {
    path: "/",
    redirect: "/home",
  },
  {
    path: "/detail",
    component: Detail,
  },
  {
    path: "/login",
    component: Login,
  },
  {
    path: "/register",
    component: Register,
  },
  {
    path: "/home",
    component: Layout,
    children: [
      {
        path: "/",
        redirect: "/home/article",
      },
      {
        path: "article",
        component: Article,
      },
      {
        path: "collect",
        component: Collect,
      },
      {
        path: "like",
        component: Like,
      },
      {
        path: "user",
        component: User,
      },
    ],
  },
  {
    path: "*",
    component: NotFound,
  },
];

const router = new VueRouter({
  routes,
});

// // ! 任何路由，被解析访问前，都会先执行这个回调
// router.beforeEach((to, from, next) => {
//   // ...
//   // from 你从哪里来， 从哪来的路由信息对象
//   // to   你往哪里去， 到哪去的路由信息对象
//   // next() 是否放行，如果next()调用，就是放行 => 放你去想去的页面
//   //  next(路径) 拦截到某个路径页面
//   console.log("to", to);
//   console.log("from", from);
//   next(); //如果不写那就没有办法跳转了
// });

export default router;
